<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
<title>mjt yahoo test</title>
<script type="text/javascript" src="../../mjt.js"></script>
<script type="text/javascript" src="./yahooapi.js"></script>
</head>

<body onload="mjt.run('top')">

<h2>Yahoo image search example</h2>
using 
<a href="http://mjtemplate.org">mjt</a>
to interact with the
<a href="http://developer.yahoo.com/common/json.html">yahoo json api</a>


<div id="top" style="display:none;">

    <div mjt.task="o">
       mjt.yahooapi.ImageSearch(mjt.urlquery.query||'kathakali')
    </div>

    <form method="get" action="">
      <div>
        <input type="text" name="query" value="${mjt.urlquery.query||''}"></input>
        <input type="submit" value="search"></input>
      </div>
    </form>

    <div mjt.choose="o.state">
      <div mjt.when="ready">
        <div mjt.for="img in o.result.Result">
            <h3>$img.Title</h3>
            <img alt="image" src="#" mjt.src="$img.Thumbnail.Url" style="float:left"></img>
            <div>$img.Summary</div>
            <hr style="clear:both"/>
        </div>
      </div>
      <div mjt.when="wait">
        loading...
      </div>
      <div mjt.when="error">
        <div mjt.for="msg in o.messages">
          $msg.message
        </div>
      </div>
    </div>
</div>

</body>
</html>
